/* 水平flex布局 */
@mixin flex-row {
	/* #ifndef APP-NVUE */
	display: flex;
	/* #endif */
	flex-direction: row;
}

/* 垂直flex布局 */
@mixin flex-col {
	/* #ifndef APP-NVUE */
	display: flex;
	/* #endif */
	flex-direction: column;
}

/* 多行省略号（行数，限制宽度）参数必传 */
@mixin line($line, $width) {
  /* #ifdef APP-NVUE */
  width: $width;
  lines: $line;
  /* #endif */
  /* #ifndef APP-NVUE */
  width: $width;  
  text-overflow: -o-ellipsis-lastline;
  display: -webkit-box;
  -webkit-line-clamp: $line;
  line-clamp: $line;
  -webkit-box-orient: vertical;
  /* #endif */
	overflow: hidden;
  text-overflow: ellipsis;
}

/* 单行省略号（限制宽度，块类型） */
@mixin line1($width, $display: inline-block) {
	/* #ifdef APP-NVUE */
	width: $width;
	lines: 1;
	/* #endif */
	/* #ifndef APP-NVUE */
	width: $width;  
	display: $display;
	text-overflow: -o-ellipsis-lastline;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	line-clamp: 1;
	-webkit-box-orient: vertical;
	/* #endif */
	overflow: hidden;
	text-overflow: ellipsis;
}

/* 边框 主要方便nvue代码编写 */
@mixin border($type: bottom, $width: 1px, $style: solid, $color: #f3f3f3) {
	@if $type == '' { 
		border-width: $width;
		border-color: $color;
		border-style: $style;
	} @else {
		border-#{$type}-width: $width;
		border-#{$type}-color: $color;
		border-#{$type}-style: $style;
	}
}

/* 页面大小 一般在 nvue 使用 */
@mixin page($bgColor: #f3f3f3) {
	/* #ifndef APP-NVUE || H5 */
	min-height: 100vh;
	/* #endif */
  /* #ifdef H5 */
  min-height: calc(100vh - 44px);
  /* #endif */
	/* #ifdef APP-NVUE */
	flex: 1;
	/* #endif */
	background-color: $bgColor;
}